<template>
    <div>
       <h1>Vue:基础语法--Vue指令</h1>
       出生地：
       <select>
           <option value="">请选择</option>
           <option value="item.id" v-for="item in city":key="item.id">{{item.name}}</option>
       </select>
       <table>
        <tr>
            <td>Id</td>
            <td>姓名</td>
            <td>头像</td>
        </tr>
        <tr v-for="item in city" :key="item.id">
            <td>{{item.id}}</td>
            <td>{{item.name}}</td>
            <td><img :src="item.img" alt="" width="100" height="100"></td>
        </tr>
       </table>
    </div>
</template>

<script setup lang="ts">
import { ref,reactive } from 'vue'
let city=ref([
    {id:1,name:'北京'},
    {id:2,name:'河南'},
    {id:3,name:'河北'},
    {id:4,name:'山西'},
    {id:5,name:'山东'},
    {id:6,name:'云南'},
    {id:7,name:'湖南'},
])

let img=ref([
    {id:1,name:'北京',img:'https://img0.baidu.com/it/u=3260376025,1255253612&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=1200'},
])
</script>

<style scoped>

</style>